<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>支付页</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <link rel="stylesheet" href="../librarys/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../librarys/font-awesome-4.5.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../styles/css.css">
    <!--[if lte IE 9]>
    <script src="../librarys/bootstrap/js/respond.js"></script>
    <script src="../librarys/bootstrap/js/html5shiv.js"></script>
    <![endif]-->
</head>
<body>
<!--头部-->
<div class="index-header">
    <div class="index-header-main">
        <a href="#">收藏本站<i class="fa fa-star index-header-icon"></i> </a>
        <p class="index-header-right">
            <a href="index.html" class="index-header-a-border">首页</a>
            <a href="login.html">登录</a>
        </p>
    </div>
</div>
<!--logo-->
<div class="index-logo">
    <!--logo-->
    <div class="index-logo-img"></div>
    <!--购物车-->
    <div class="shop-cart-txt">结算页</div>
    <!--进度条-->
    <div class="pay-progress-bar mt50">
        <span><img src="../images/pay_nav1.png">1.我的购物车</span>
        <span><img src="../images/pay_nav2.png">2.填写核对订单信息</span>
        <span><img src="../images/pay_nav3.png">3.成功提交信息</span>
    </div>
</div>
<!--内容-->
<div class="pay-content mt50">
    <h2 class="mb24">填写并核对信息</h2>
    <div class="pay-content-container">
        <!--姓名电话-->
        <div class="pay-content-container-message border-bottom">
            <h2 class="pay-content-container-method-h2 mb15">请填写您的姓名和手机号</h2>
            <form>
                <input class="pay-content-container-message-name" placeholder="请输入您的姓名">
                <input class="pay-content-container-message-phone" placeholder="请输入您的手机号">
                <!--<button type="submit" disabled="disabled" class="pay-content-container-message-submit">确定</button>-->
            </form>
        </div>
        <!--支付方式-->
        <div class="pay-content-container-message border-bottom">
            <h2 class="pay-content-container-method-h2 mb15">支付方式</h2>
            <p class="pay-content-container-method-class">
                <span>支付宝支付<b><img src="../images/detail-icon.png"></b></span>
                <span>微信支付<b><img src="../images/detail-icon.png"></b></span>
                <span>银联支付<b><img src="../images/detail-icon.png"></b></span>
            </p>
        </div>
        <!--商品详情-->
        <div class="pay-content-container-message">
            <h3 class="pay-content-container-commodity-h3 mb15">商家：PIXELFILM婚礼摄影工作室</h3>
            <div class="pay-content-container-commodity-message">
                <!--图片-->
                <div class="order-container-content-list-item-li-img">
                    <a href="detail.html"><img src="../images/detail-img3.jpg"></a>
                </div>
                <!--详情-->
                <div class="order-container-content-list-item-li-txt">
                    <a href="detail.html">婚礼摄影 摄像师 商业会议摄影摄像跟拍拍摄服务 </a>
                    <span class="mt10">类型：单机位</span>
                    <em class="pay-content-container-commodity-message-money mt15">¥800.00</em>
                </div>
            </div>
        </div>
    </div>
    <p class="pay-content-all mt15 mb15">总共1件商品金额 ：<span class="ml35">¥800.00</span></p>
    <p class="pay-content-all mb24">使用优惠券：<span class="ml35">-¥100.00</span></p>
    <p class="pay-content-all-money mb24">应付总额：<span>¥700.00</span></p>
    <a class="pay-at-once" href="#">支付</a>
</div>
<!--底部-->
<div class="index-foot">
    <!--关于我们-->
    <div class="index-foot-about-us">
        <div class="index-foot-about-us-li">
            <h3>客服热线</h3>
            <p>工作时间：每天9:00~18:00</p>
            <span>0516—87931291</span>
        </div>
        <div class="index-foot-about-us-li">
            <h3>关注我们</h3>
            <a href="#">微信公证号</a><br>
            <a href="#">新浪微博</a><br>
            <a href="#">腾讯QQ</a>
        </div>
        <div class="index-foot-about-us-li">
            <h3>关于我们</h3>
            <a href="#">加入我们</a><br>
            <a href="#">网站地图</a><br>
        </div>
        <div class="index-foot-about-us-li">
            <h3>联系我们</h3>
            <p>邮箱：12345645@qq.com</p>
            <p>地址：徐州市云龙区建国路12号</p>
        </div>
    </div>
    <!--备案号-->
    <div class="index-foot-record-number">
        <div class="index-foot-record-number-txt">
            苏公网安备 11000002000088号  |  苏ICP证070359号
        </div>
    </div>
</div>
<script src="../librarys/superslider/jquery1.42.min.js"></script>
<script>
//    var Name_val,Phone_val;
    $(document).ready(function () {
//        $(".pay-content-container-message-name").blur(function(){
//            Name_val =$(".pay-content-container-message-name").val();
//            if (Name_val!=""&&Phone_val!=""){
//                $('.pay-content-container-message-submit').attr("disabled","");
//                $('.pay-content-container-message-submit').css({"background":"#ff6278","color":"#fff"})
//            }
//        });
//        $(".pay-content-container-message-phone").blur(function(){
//            Phone_val =$(".pay-content-container-message-phone").val();
//            if (Name_val!=""&&Phone_val!=""){
//                $('.pay-content-container-message-submit').attr("disabled","");
//                $('.pay-content-container-message-submit').css({"background":"#ff6278","color":"#fff"})
//            }
//        });
        $(".pay-content-container-method-class span").bind("click",function () {
            $(".pay-content-container-method-class span").removeClass("active");
            $(this).addClass("active");
            return false;
        });
    });
</script>
</body>
</html>